<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> -->
  <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
  <!--[if lt IE 9]>
  <script src="js/lib/html5shiv.min.js"></script>
  <![endif]-->
  <meta name="apple-mobile-web-app-capable" content="yes">  <!-- 苹果允许全屏模式 -->
  <meta name="apple-mobile-web-app-status-bar-style" content="black">  <!-- 苹果浏览器顶部状态栏颜色 -->
  <meta name="format-detection" content="telephone=no">  <!-- 忽略数字为电话号码 -->
  <link rel="apple-touch-icon-precomposed" href="../public/images/icon/logo-28.png">
  <link rel="shortcut icon" href="../public/images/icon/logo-28.png">
  <link rel="icon" type="image/x-icon" href="../public/images/icon/logo-28.png">
	<title>洗个毛-官方网站-叮叮科技</title>
	<link rel="stylesheet" href="../public/css/lib/normalize.css">
	<link rel="stylesheet" href="../public/css/index.css">
</head>
<body>
  <div class="wp">
        <div class="wp-inner">
            <div class="page page1">
              <div class="mid">
                <div class="logo"></div>
                <div class="text title">洗个毛</div>
                <div class="text sub-title">Best care for your pets</div>
                <div class="text new-title">叮叮宠物全新开通上门服务</div>
                <div class="text new-sub-title">
                靠谱的宠物美容师团队<br>
                为爱宠提供上门洗澡，美容，寄养等服务
                </div>
              </div>
            </div>
            <div class="page page2">
              <div class="mid">
                <div class="q">懒得自己出门<span class="wenhao">？</span></div>
                <div class="a"></div>
                <div class="a1">
                  您的懒<br><br>我们来承包
                </div>
                <div class="a2">
                  宠物美容车上门服务，为成都宠友开启一个全新的养宠时代
                </div>
              </div>
            </div>
            <div class="page page3">
              <div class="mid">
                <div class="q">外面的不放心<span class="wenhao">？</span></div>
                <div class="a"></div>
                <div class="a1">
                  专业美容车<br><br>专狗专用 干净卫生
                </div>
                <div class="a2">
                  狗狗所用的美容工具(剪刀、剃刀、毛巾等)均经过严格消毒,避免交叉感染
                </div>
              </div>
            </div>
            <div class="page page4">
              <div class="mid">
                <div class="q">体检价格很贵<span class="wenhao">？</span></div>
                <div class="a"></div>
                <div class="a1">
                  免费体检<br><br>真正的实惠
                </div>
                <div class="a2">
                  我们为爱宠服务时会给狗狗做免费的体检，真正疼爱您的宠儿
                </div>
              </div>
            </div>
            <div class="page page5">
              <div class="mid">
                <div class="q">这样就行了吗<span class="wenhao">？</span></div>
                <div class="text title">首次下单<span>9.9</span>元</div>
                <div class="text sub-title">更多优惠 等你来拿</div>
                <div class="code"></div>
                <div class="text welcome">欢迎关注微信公众平台 <br>洗个毛</div>
                <div class="btn">
                  <a class="ios">IOS下载</a>
                  <a href="http://app.mi.com/detail/81039" class="android" id="android">安卓下载</a>
                </div>
              </div>
              <div class="copyright">
                叮叮科技 <br> Copyright © 叮叮宠物科技. All rights reserved.黔ICP备14001509号
              </div>
            </div>
        </div>
         <ul class="indicator">
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
        </ul>
  </div>
  <span class="start"><b></b></span>
  <!-- 引入脚本 -->
	<script src="../public/js/lib/zepto-1.1.6.min.js"></script>
	<script src="../public/js/index.min.js"></script>
  <script>
    $(function(){
      $('#android').on('tap',function() {
        location.href = 'http://app.mi.com/detail/81039';
      });
      var waiterTime = 1900,
          page2Q = $('.page2 .q'),
          page2A = $('.page2 .a'),
          page2A1 = $('.page2 .a1'),
          page2A2 = $('.page2 .a2'),
          page3Q = $('.page3 .q'),
          page3A = $('.page3 .a'),
          page3A1 = $('.page3 .a1'),
          page3A2 = $('.page3 .a2'),
          page4Q = $('.page4 .q'),
          page4A = $('.page4 .a'),
          page4A1 = $('.page4 .a1'),
          page4A2 = $('.page4 .a2'),
          page5Q = $('.page5 .q'),
          page5All = $('.page5 .title,.page5 .sub-title,.page5 .code,.page5 .welcome,.page5 .btn,.page5 .copyright'),
          flag1 = true,
          flag2 = true,
          flag3 = true,
          flag4 = true,
          flag5 = true;
      $('.wp-inner').fullpage({
              change: function (e) {
                  console.log('change', e.next, e.cur);
                  $('.indicator li').removeClass('cur').eq(e.next).addClass('cur');
                  if(e.next == 0) {
                    
                  }else if(e.next == 1 && flag1) {
                    page2Q.addClass('in');
                    page2A.addClass('in');
                    page2A1.addClass('in');
                    page2A2.addClass('in');
                    flag1 = false;
                    setTimeout(function(){
                      page2Q.removeClass('in');
                    },waiterTime);
                  }else if(e.next == 2 && flag2) {
                    page3Q.addClass('in');
                    page3A.addClass('in');
                    page3A1.addClass('in');
                    page3A2.addClass('in');
                    flag2 = false;
                    setTimeout(function(){
                      page3Q.removeClass('in');
                    },waiterTime);
                  }else if(e.next == 3 && flag3) {
                    page4Q.addClass('in');
                    page4A.addClass('in');
                    page4A1.addClass('in');
                    page4A2.addClass('in');
                    flag3 = false;
                    setTimeout(function(){
                      page4Q.removeClass('in');
                    },waiterTime);
                  }else if(e.next == 4 && flag4) {
                    page5Q.addClass('in');
                    page5All.addClass('in');
                    flag4 = false;
                    setTimeout(function(){
                      page5Q.removeClass('in');
                    },waiterTime);
                  }
              },
              beforeChange: function (e) {
                  console.log('beforeChange', e.next, e.cur);
              },
              afterChange: function (e) {
                  console.log('afterChange', e.next, e.cur);
              },
              drag: true
          });
    });
  </script>
</body>
</html>